import 'dart:math';

import 'package:flutter/material.dart';

class TrapezoidClipper extends CustomClipper<Path> {
  final double topWidth;
  final double bottomWidth;
  final double height;
  final bool flip;

  TrapezoidClipper({
    required this.topWidth,
    required this.bottomWidth,
    required this.height,
    required this.flip,
  });

  @override
  Path getClip(Size size) {
    Path trapezoidPath = Path();
    if (flip) {
      var minWidth = min(topWidth, bottomWidth);
      var width = max(topWidth, bottomWidth);

      if (topWidth > bottomWidth) {
        trapezoidPath.moveTo(width, 0); // 左上角
        trapezoidPath.lineTo(width, height); // 右上角（水平边）
        trapezoidPath.lineTo(0, height); // 右下角（斜边）
        trapezoidPath.lineTo(width - minWidth, 0); // 左下角（垂直边）
      } else {
        trapezoidPath.moveTo(width, 0); // 左上角
        trapezoidPath.lineTo(width, height); // 右上角（水平边）
        trapezoidPath.lineTo(width - minWidth, height); // 右下角（斜边）
        trapezoidPath.lineTo(0, 0); // 左下角（垂直边）
      }

    } else {
      trapezoidPath.moveTo(0, 0); // 左上角
      trapezoidPath.lineTo(topWidth, 0); // 右上角（水平边）
      trapezoidPath.lineTo(bottomWidth, height); // 右下角（斜边）
      trapezoidPath.lineTo(0, height); // 左下角（垂直边）


    }

    trapezoidPath.close();

    return trapezoidPath;
  }

  @override
  bool shouldReclip(covariant CustomClipper<Path> oldClipper) {
    // 由于我们的Clipper依赖于特定的尺寸（上底、下底和高度），
    // 如果这些尺寸发生变化，我们应该返回true来重新裁剪。
    // 在这个例子中，我们简单地总是返回true，因为我们的Clipper没有状态来跟踪尺寸是否变化。
    // 在实际应用中，你可能需要更智能地处理这个逻辑。
    if (oldClipper is TrapezoidClipper) {
      final oldClipperAs = oldClipper as TrapezoidClipper;
      return oldClipperAs.topWidth != topWidth ||
          oldClipperAs.bottomWidth != bottomWidth ||
          oldClipperAs.height != height;
    }
    return true;
  }
}

class TrapezoidWidget extends StatelessWidget {
  final Widget child;
  final double topWidth; //较短线为 top
  final double bottomWidth;
  final double height;
  final Color color;
  final bool flip;

  TrapezoidWidget({
    required this.child,
    required this.topWidth,
    required this.bottomWidth,
    required this.height,
    required this.color,
    required this.flip,
  });

  @override
  Widget build(BuildContext context) {
    var width = max(topWidth, bottomWidth);
    return Container(
        height: height,
        width: width,
        child: ClipPath(
          clipper: TrapezoidClipper(
              topWidth: topWidth, bottomWidth: bottomWidth, height: height, flip: flip),
          child: Container(color: color, child: child),
        ));
  }
}
